<template>
  <div class="main1 d-center">
    <div class="success d-center" v-if="iconShow == 1 || iconShow == 4">
      <i class="d-center" style="margin-right:0;">
        <img src="@/assets/img/right.png" alt />
      </i>
    </div>
    <div class="danger d-center" v-if="iconShow == 2">
      <i class="d-center" style="margin-right:0;">
        <img src="@/assets/img/waring.png" alt />
      </i>
    </div>
    <div class="white d-center" v-if="iconShow == 3 || iconShow == 5">
      <i class="d-center" style="margin-right:0;">
        <!-- <img src="@/assets/img/more.png" alt /> -->
      </i>
    </div>
    <!-- <div class="d-center" v-if="iconShow == 4">
      <span style="color:green;">有</span>
    </div>
    <div class="d-center" v-if="iconShow == 5">
      <span style="color:white;">无</span>
    </div> -->
  </div>
</template>

<script>
export default {
  props: ["iconShow"],
  data() {
    return {};
  }
};
</script>

<style scoped lang="less">
.success {
  width: 25px;
  height: 25px;
  background: #67c23a;
  border-radius: 50%;
  i {
    width: 25px;
    height: 25px;
  }
}
.danger {
  width: 25px;
  height: 25px;
  background: #f56c6c;
  border-radius: 50%;
}
.white {
  width: 25px;
  height: 25px;
  background: white;
  border-radius: 50%;
  border: 1px solid #ccc;
  i {
    width: 25px;
    height: 25px;
  }
}
img {
  width: 15px;
}
</style>